<template>
  <div class="son">
    <h3>这是孙组件</h3>
    <div>车名:{{name}}, 价格: {{price}}万</div>
    <span>这里也能修改...</span>
    <button @click="name += '*'">修改车名</button>
    <button @click="price++">修改价格</button>
  </div>
</template>

<script>
import { inject, toRefs } from 'vue'

export default {
  setup() {
    let car = inject('car')
    return {...toRefs(car)}
  },
}
</script>

<style scoped>
  .son {
    background-color: burlywood;
    padding: 5px;
  }

  span {
    margin-top: 5px;
  }

  button {
    margin-top: 5px;
    margin-left: 5px;
  }
</style>